<template>
    <div>
        <h2> 优惠卷添加</h2>
        <table class="table table-bordered">
            <tbody>
                <tr>
                    <td>卷类型</td>
                    <td>
                        <select v-model="model.DisCountType">
                            <option value="0">请选择</option>
                            <option value="满减卷">满减卷</option>
                            <option value="代金券">代金券</option>
                            <option value="优惠券">优惠券</option>
                            <option value="折扣券">折扣券</option>
                        </select>
                    </td>
                </tr>



                <tr>
                    <td>代金卷标题</td>
                    <td>

                        <input type="text"  v-model="model.Title"/>
                    </td>
                </tr>



                <tr>
                    <td>代金卷副标题</td>
                    <td>
                        <input type="text" v-model="model.Titles"/>
                    </td>
                </tr>


                <tr>
                    <td>图片</td>
                    <td>
                        <input type="file" @change="changeImg"/>
                        <img :src="model.Photo" width="100" height="100" />
                    </td>
                </tr>


                <tr>
                    <td>库存</td>
                    <td>
                        <input type="text"  v-model="model.Number"/>
                    </td>
                </tr>


                <tr>
                    <td>每人限领</td>
                    <td>
                        <input type="text" v-model="model.Count"/>
                    </td>
                </tr>


                <tr>
                    <td>使用条件</td>
                    <td>
                        <input type="text"  v-model="model.Num"/>
                    </td>
                </tr>


                <tr>
                    <td>减免金额</td>
                    <td>
                        <input type="text"  v-model="model.Money"/>
                    </td>
                </tr>


                <tr>
                    <td>有效期</td>
                    <td>
                        <input type="date"  v-model="model.CreateTime"/>- <input type="date"  v-model="model.UpdateTime"/>
                    </td>
                </tr>


                <tr>
                    <td>适合业务</td>
                    <td>
                        <input type="checkbox" name="yewu" value="洗车"  v-model="model.YeWu" />洗车
                        <input type="checkbox" name="yewu" value="订房"    v-model="model.YeWu"/>订房
                        <input type="checkbox" name="yewu" value="商城"   v-model="model.YeWu"/>商城
                        <input type="checkbox" name="yewu" value="收款码"    v-model="model.YeWu"/>收款码
                    </td>
                </tr>


                <tr>
                    <td>使用须知</td>
                    <td>
                        <textarea rows="5" cols="25"  v-model="model.XuZhi"></textarea>
                    </td>
                </tr>


                <tr>
                    <td>适用门店</td>
                    <td>
                        <select  v-model="model.ShopId">
                            <option value="-1">请选择</option>
                            <option v-for="item in shopList" :key="item.Id" :value="item.Id">{{item.ShopName}}</option>
                        </select>
                    </td>
                </tr>

                <tr>
                    <td>联系方式</td>
                    <td>
                        <input type="text"  v-model="model.Phone" maxlength="11"/>
                    </td>
                </tr>

                <tr>
                    <td></td>
                    <td>
                        <input type="button" value="添加" class="btn btn-success" @click="ok"/>
                    </td>
                </tr>


    
            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">
import { ref,reactive, onMounted} from 'vue'
import axios from 'axios'
import { useRoute,useRouter } from 'vue-router'
const route = useRoute()    
const router = useRouter()


//上传
const  changeImg = (e:any)=>{
    var obj = e.target.files[0]
    var f = new FormData();
    f.append('file',obj);

    axios({
    url: 'https://localhost:7059/api/DisCount/UpFiles',
    method: 'post',
    data: f
    }).then((res)=>{
        console.log(res.data)
        model.Photo=res.data
    })
    .catch((err)=>{
        console.log(err)
    })



}

//门店列表
const shopList:any = ref([])
onMounted(()=>{
    GetList();//门店列表
})


const GetList = ()=>{
    //请求门店列表
axios({

url:'https://localhost:7059/api/DisCount/ShopList',
method:'get',
})
.then((res)=>{
    console.log(res)
    shopList.value = res.data;
})
.catch((err)=>{
    console.log(err)
})


}




//添加
let model:any=reactive({
    

  "DisCountType": 0,
  "Title": '',
  "Titles":  '',
  "Photo":  '',
  "Number":  '',
  "Count":  '',
  "Num":  '',
  "Money":  '',
  "CreateTime":  '',
  "UpdateTime":  '',
  "YeWu":  [],
  "XuZhi":  '',
  "ShopId": -1,
  "Phone":  '',

})


const ok=()=>{
if(model.Title==''){
    alert('请输入标题')
    return
}

if(model.Photo==''){
    alert('请上传图片')
    return
}
if(model.Number==''){
    alert('请输入库存')
    return
}
if(model.Money==''){
    alert('请输入减免金额')
    return
}

if(model.CreateTime=='' || model.UpdateTime==''){

    alert('请输入有效时间')
    return
}

if(model.YeWu.length==0){
    alert('请选择业务')
    return
}



if(model.ShopId==-1){
    alert('请选择门店')
    return
}



    model.YeWu=model.YeWu.toString()
    axios({
    url: 'https://localhost:7059/api/DisCount/DisCountAdd',
    method: 'post',
    data: model
    }).then((res)=>{
        console.log(res)
        if(res.data>0){
            alert('添加成功')
            router.push('/DisCountList')
        }
        else{
            alert('添加失败')
        }
    })
    .catch((err)=>{
        console.log(err)
    })


}




</script>

<style scoped></style>